<template>
  <d2-container :class="{ 'page-compact': crud.pageOptions.compact }">
    <d2-crud-x
      ref="d2Crud"
      v-bind="_crudProps"
      v-on="_crudListeners"
      @cancelUpdate="cancelUpdate"
    >
      <div slot="header">
        <crud-search
          ref="search"
          :options="crud.searchOptions"
          @submit="handleSearch"
        />
        <crud-toolbar
          :search.sync="crud.searchOptions.show"
          :compact.sync="crud.pageOptions.compact"
          :columns="crud.columns"
          @refresh="doRefresh()"
          @columns-filter-changed="handleColumnsFilterChanged"
        />
      </div>
      <template slot="download_urlSlot" slot-scope="scope">
        <el-link :href="scope.row.download_url" type="primary" target="_blank">下载</el-link>
      </template>
    </d2-crud-x>
  </d2-container>
</template>

<script>
import * as api from './api'
import { crudOptions } from './crud'
import { d2CrudPlus } from 'd2-crud-plus'
export default {
  name: 'appVersionDeviceUpgrade',
  mixins: [d2CrudPlus.crud],
  props: {
    // 升级版本id
    versionId: {
      type: Number,
      required: false
    },
    // 所属设备id
    deviceManageId: {
      type: Number,
      required: false
    }
  },
  watch: {
    versionId () {
      this.doRefresh({ from: 'load' })
    },
    deviceManageId () {
      this.doRefresh({ from: 'load' })
    },
  },
  data () {
    return {}
  },
  methods: {
    getCrudOptions () {
      return crudOptions(this)
    },
    pageRequest (query) {
      query.app_version = this.versionId
      query.app_device_manage = this.deviceManageId
      return api.GetList(query)
    },
    delRequest (row) {
      return api.DelObj(row.id)
    },
    // 取消更新
    cancelUpdate (data) {
      this.$confirm('确定要取消更新吗？', '取消更新', { type: 'warning' }).then(() => {
        api.CancelUpdate({ id: data.row.id }).then(ret => {
          if (ret.code === 2000) {
            this.versionRollbackDialog = false
            this.$message.success('取消更新成功')
            this.doRefresh({ from: 'load' })
          }
        })
      })
    }
  }
}
</script>
